@CHARSET "utf-8";
*{
    margin:0;padding:0;
    -webkit-tap-highlight-color:rgba(0,0,0,0);
    -webkit-text-size-adjust:100%;
    box-sizing:border-box;
    -webkit-box-sizing:border-box; /* Safari */
    -moz-box-sizing:border-box; /* Firefox */
    -ms-text-size-adjust: 100%;
    -webkit-overflow-scrolling: touch;
}
input[type=search]::-webkit-search-cancel-button { display: none;}
html{font:20px/1.20 'Helvetica',Arial,sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}
html,body{font-family: 'Helvetica',Arial,sans-serif;}
body,p,form,input,button,dl,dt,dd,ol,h1,h2,h3,h4,h5,h6{margin:0;padding:0;overflow-x:hidden;}
p{line-height:1.3;}
ul,li{margin:0;padding:0;}
h1,h2,h3,h4,h5,h6{font-size:100%;}
input,textarea,select{-webkit-user-select:text;-ms-user-select:text;user-select:text;-webkit-appearance:none;}
textarea{resize:none;}
*:not(input,textarea) {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
}
table{border-collapse:collapse;}
input,select,textarea{outline:none;border:none;background:none;}
a{text-decoration:none;-WebKit-touch-callout:none;outline:0;cursor:pointer;color:#333333;}
a,button,input{-webkit-tap-highlight-color:rgba(255,0,0,0);}
li,ol{list-style:none;}
.clearfix{*zoom:1;}
.clearfix:after{display:block;overflow:hidden;clear:both;height:0;visibility:hidden;content:".";}
body{margin:0 auto;width:100%;background-color:#ffffff;color:#444444;font-size:0.85rem;text-align:justify; text-justify:auto;}
img{border:none;vertical-align:middle;}
video{max-width:100%;max-height: 100%}
::-webkit-scrollbar{width: 0;height: 0;}
::-webkit-scrollbar-track {background-color: transparent;} /* 滚动条的滑轨背景颜色 */
::-webkit-scrollbar-thumb {background-color: transparent;} /* 滑块颜色 */
::-webkit-scrollbar-button {background-color: transparent;} /* 滑轨两头的监听按钮颜色 */
::-webkit-scrollbar-corner {background-color: transparent;} /* 横向滚动条和纵向滚动条相交处尖角的颜色 */
/*公共样式*/
.fl{float:left;}
.fr{float:right;}
.pos-r{position: relative;}
.pos-a{position: absolute;}
.pos-f{position: fixed;}
.txtalign-l{text-align: left !important;}
.txtalign-c{text-align: center !important;}
.txtalign-r{text-align: right !important;}
.dis-n{display:none;}
.dis-b{display:block;}

.mt-20{margin-top: 0.5rem;}
.mt-30{margin-top: 0.75rem;}
.mt-40{margin-top: 1rem;}
.mt-60{margin-top: 1.5rem;}
.mt-80{margin-top: 2rem;}
.mt-100{margin-top: 2.5rem;}
.mt-120{margin-top: 3rem;}
/*-------------------------------------------------------------*/
@media screen and (min-width: 320px) {html{font-size:106.6666%;}}
@media screen and (min-width: 360px) {html{font-size:120%;}}
@media screen and (min-width: 375px) {html{font-size:125%;}}
@media screen and (min-width: 384px) {html{font-size:128%;}}
@media screen and (min-width: 393px) {html{font-size:131%;}}
@media screen and (min-width: 400px) {html{font-size:133.3333%;}}
@media screen and (min-width: 412px) {html{font-size:137.333333%;}}
@media screen and (min-width: 414px) {html{font-size:138%;}}
@media screen and (min-width: 440px) {html{font-size:146.6666%;}}
@media screen and (min-width: 480px) {html{font-size:160%;}}
@media screen and (min-width: 520px) {html{font-size:173.3333%;}}
@media screen and (min-width: 560px) {html{font-size:186.6666%;}}
@media screen and (min-width: 600px) {html{font-size:200%;}}
@media screen and (min-width: 640px) {html{font-size:213.3333%;}}
@media screen and (min-width: 680px) {html{font-size:226.6666%;}}
@media screen and (min-width: 720px) {html{font-size:240%;}}
@media screen and (min-width: 760px) {html{font-size:253.3333%;}}
@media screen and (min-width: 800px) {html{font-size:266.6666%;}}
@media screen and (min-width: 1080px) {html{font-size:360%;}}
@media screen and (min-width: 1200px) {html{font-size:400%;}}
@media screen and (min-width: 1280px) {html{font-size:426.6666%;}}



.fullPage-wp{
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
}
.fullPage-wp:after {
    display: block;
    content: ' ';
    height: 0;
    clear: both;
}
.fullPage-wp.anim{
    -webkit-transition: all 500ms ease-out 0s;
    transition: all 500ms ease-out 0s;
}
.fullPage-page{
    display: block;
    overflow: hidden;
}

.fullPage-dir-h {
    float: left;
}
html,body{height: 100%;width: 100%;background-color: rgba(0,0,0,1);}


.wp{height: 100%;width: 100%;overflow: hidden;}
.page{position: relative;}
.bgImg007{position: absolute;z-index: -1;opacity: 0.5;}
.nextGo{
    position: fixed;
    bottom: 20px;
    left: 50%;
    margin-left: -9px;
    width: 18px;
    height: 18px;
    overflow: hidden;
    -webkit-animation: start 1.5s 2s infinite ease-in-out;
    animation: start 1.5s 2s infinite ease-in-out;
    opacity: 0;
}
.nextGo div{
    background-color: #ffffff;
    height: 22px;
    width: 6px;
}
.nextGoL{
    float: left;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
}
.nextGoR{
    float: right;
    -webkit-transform: rotate(134deg);
    transform: rotate(134deg);
}
@-webkit-keyframes start{0%,30%{opacity:0;-webkit-transform:translateY(10px)}60%{opacity:1;-webkit-transform:translate(0)}to{opacity:0;-webkit-transform:translateY(-8px)}}@keyframes start{0%,30%{opacity:0;transform:translateY(10px)}60%{opacity:1;transform:translate(0)}to{opacity:0;transform:translateY(-8px)}}
/*第一屏*/
.bgImgpage1 {
    -webkit-transform: translateY(100px);
    transform: translateY(100px);
    opacity: 0.3;
}
.page1 .bgImgpage1 {
    -webkit-transition: all 2s ease ;
    transition: all 2s ease ;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
}
.page1-til-box {
    width: 100%;
    margin: 47% auto 0;
    text-align: center;
    position: relative;
    box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 0px;
}
.page1-Til {
    width: 65%;
    opacity: 0;
}
.page1 .page1-Til-Text2{
    -webkit-animation: puffIn 1s ease 1 normal both;
}
.page1-Til-Text1 {
    margin-top: 2%;
    opacity: 0;
}
.page1 .page1-Til-Text1{
    -webkit-animation: puffIn 0.7s ease 1s normal both;
}
.page1-2{
    position: absolute;
    left: 15%;
    top: 44%;
    width: 79%;
    opacity: 0;
}
.page1 .page1-2{
    -webkit-transition: all 1.7s  1.4s;
    transition: all 1.7s  1.4s;
    opacity: 1;
}
.page1-til-kuang {
    width: 90%;
    position: absolute;
    top: 0;
    left: 5%;
    opacity: 0;
}
.page1 .page1-til-kuang1{
    animation: puffIn 1s ease 0.2s 1 normal both;
    -webkit-animation: puffIn 1s ease 0.2s 1 normal both;
}
.page1 .page1-til-kuang2{
    animation: puffIn 1s ease 0.8s 1 normal both;
    -webkit-animation: puffIn 1s ease 0.8s 1 normal both;
}
.page1-til-kuang3{
    -webkit-transform-origin: 50% 50%;
    -webkit-transform: scale(0);
    transform: scale(0);
}
.page1 .page1-til-kuang3{
    opacity: 1;
    -webkit-transition: all 0.9s ease-in 1.4s;
    transition: all 0.9s ease-in 1.4s;
    -webkit-transform-origin: 50% 50%;
    -webkit-transform: scale(1);
    transform: scale(1);
}
.page1-til-kuang4{
    -webkit-transform-origin: 50% 50%;
}
.page1 .page1-til-kuang4{
    animation: puffOut 2s ease 2s infinite normal;
    -webkit-animation: puffOut 2s ease 2s infinite normal;
}
@-webkit-keyframes puffOut {
    0% {

        opacity: 1;
        -webkit-transform-origin: 50% 50%;
        -webkit-transform: scale(1);
    }

    100% {
        opacity: 0;
        -webkit-transform-origin: 50% 50%;
        -webkit-transform: scale(2);
    }
}

@keyframes puffOut {
    0% {
        opacity: 1;
        transform-origin: 50% 50%;
        transform: scale(1);
    }

    100% {
        opacity: 0;
        transform-origin: 50% 50%;
        transform: scale(2);
    }
}
@-webkit-keyframes puffIn {
    0% {
        opacity: 0;
        -webkit-transform-origin: 50% 50%;
        -webkit-transform: scale(2);
    }

    to {
        opacity: 1;
        -webkit-transform-origin: 50% 50%;
        -webkit-transform: scale(1);
    }
}

@keyframes puffIn {
    0% {
        opacity: 0;
        transform-origin: 50% 50%;
        transform: scale(2);
    }

    to {
        opacity: 1;
        transform-origin: 50% 50%;
        transform: scale(1);
    }
}
.page1-dose {
    text-align: center;
    color: #ffffff;
    margin-top: 10%;
    font-size: 1rem;
    line-height: 1.1rem;
    opacity: 0;
}
.page1 .page1-dose{
    animation: zoomIn 1s ease 1.8s 1 normal both;
    -webkit-animation: zoomIn 1s ease 1.8s 1 normal both;
}
.page1 .page1-dose2{
    animation: zoomIn 1s ease 2s 1 normal both;
    -webkit-animation: zoomIn 1s ease 2s 1 normal both;
}
.page1-dose2{
    font-size: 0.8rem;
    margin-top: 5%;
    line-height: 1.3rem;
}
@-webkit-keyframes zoomIn {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(0,0,0);
    }

    100% {
        opacity: 1;
        -webkit-transform: scale3d(1,1,1);
    }
}

@keyframes zoomIn {
    0% {
        opacity: 0;
        transform: scale3d(0,0,0);
    }

    100% {
        opacity: 1;
        transform: scale3d(1,1,1)
    }
}
/*第二屏*/
.dongTil {
    text-align: center;
    position: relative;
    top: 5%;
    opacity: 0;
}
.dongba {
    width: 95%;
}
.dongdong {
    position: absolute;
    top: 0;
    left: 50%;
    top: 50%;
    transform: translate(-50% ,-50%);
    -webkit-transform: translate(-50% ,-50%);
    width: 115%;
    opacity: 0;
}
.page2 .dongdong ,.page3 .dongdong ,
.page4 .dongdong,.page5 .dongdong ,.page6 .dongdong {
    -webkit-transition: all 0.2s linear 1.2s;
    transition: all 0.2s linear 1.1s;
    opacity: 1;
}
.page2 .dongTil ,.page3 .dongTil,
.page4 .dongTil,.page5 .dongTil,.page6 .dongTil{
    -webkit-animation: fadeIn 0.8s ease  1 normal forwards;
    animation: fadeIn 0.8s ease 1 normal forwards;
}
@-webkit-keyframes fadeIn {
    0% {
        opacity: 0;
        -webkit-transform: translateY(-100px);
    }
    to {
        opacity: 1;
        -webkit-transform: translateY(0px);
    }
}

@keyframes fadeIn {
    0% {
        opacity: 0;
        transform: translateY(-100px);
    }
    to {
        opacity: 1;
        transform: translateY(0px);
    }
}
.dongXin{
    width: 100%;
    position: absolute;
    top: 0;
    left: 50%;
    top: 50%;
    transform: translate(-50% ,-50%);
    -webkit-transform: translate(-50% ,-50%);
    font-size: 1.2rem;
    color: #ffffff;
}
.dongXin img{
    width: 50%;
    -webkit-transform: scale(0.3);
    opacity: 0;
}
.page2 .dongXin img ,.page3 .dongXin img,
.page4 .dongXin img,.page5 .dongXin img,.page6 .dongXin img{
    animation: dongda 1s ease 0.4s 1  normal forwards,zoomInD 3.5s ease 2.0s infinite  normal;
    -webkit-animation:dongda 1s ease 0.4s 1  normal forwards,zoomInD 3.5s ease 2.0s infinite  normal;
}
.dongXin p{
    display: block;
    text-align: center;
    overflow: hidden;
    -webkit-transform: scale(0);
}
.page2 .dongXin p,.page3 .dongXin p,
.page4 .dongXin p,.page5 .dongXin p,.page6 .dongXin p{
    -webkit-transition: all 1.5s 0.8s;
    -webkit-transform: scale(0.8);
    transition: all 1.5s 0.8s;
    transform: scale(0.8);
}
@-webkit-keyframes dongda {
    0% {
        opacity: 0;
        -webkit-transform: scale(0.2);
    }
    100% {
        opacity: 0.8;
        -webkit-transform: scale(0.8);
    }
}
@keyframes dongda {
    0% {
        opacity: 0;
        transform: scale(0.2);
    }
    100% {
        opacity: 0.8;
        transform: scale(0.8);
    }
}
@-webkit-keyframes zoomInD {
    0% {
        opacity: 0.8;
        -webkit-transform: scale(0.8);
    }

    50% {
        opacity: 0.5;
        -webkit-transform: scale(0.7);
    }

    100% {
        opacity: 0.8;
        -webkit-transform: scale(0.8);
    }
}

@keyframes zoomInD {
    0% {
        opacity: 0.8;
        transform: scale(0.8)
    }

    50% {
        opacity: 0.5;
        transform: scale(0.7)
    }
    100% {
        opacity: 0.8;
        transform: scale(0.8)
    }
}
.footBor {
    width: 95%;
    position: absolute;
    bottom: 8%;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translate(-50%,200px);
}
.page2 .footBor ,.page3 .footBor,
.page4 .footBor,.page5 .footBor,.page6 .footBor{
    transition: all 1s 0s;
    -webkit-transform: translate(-50%,0);
    -webkit-transition: all 1s 0s;
    transform: translate(-50%,0);
}
.dcse {
    margin-top: 2rem;
    -webkit-transform: translateX(90%);
    transform: translateX(90%);
    opacity: 0;
}
.dcse p {
    font-size: 0.75rem;
    color: #ffffff;
    padding: 0 12%;
    line-height: 1.7;
}
.page2 .dcse {
    -webkit-transition: all 1.2s 1s;
    -webkit-transform: translateX(0);
    transition: all 1.2s 1s;
    transform: translateX(0);
    opacity: 1;
}
/*第三屏*/
.expBox {
    text-align: center;
    position: relative;
}
.expBor{
    width: 72%;
}
.exp1F {
    position: absolute;
    top: 14.5%;
    width: 20%;
    left: 26.5%;
}
.exp1T {
    position: absolute;
    top: 29%;
    left: 49%;
    text-align: left;
    font-size: 0.70rem;
    color: #ffffff;
    line-height: 1.5;
}
.exp2F {
    position: absolute;
    top: 15.5%;
    width: 20%;
    right: 26%;
}
.exp2T{
    position: absolute;
    top: 29%;
    right: 49%;
    text-align: right;
    font-size: 0.70rem;
    color: #ffffff;
    line-height: 1.5;
}
.expBox1,.expBox2 {
    opacity: 0;
}
.page3 .expBox1{
    animation: fadeInRight 1.0s ease 1s 1 normal both;
}
.page3 .expBox2{
    animation: fadeInLeft 1.0s ease 1s 1 normal both;
}
.page3 .exp1F,.page3 .exp2F ,.page3 .exp1T,.page3 .exp2T {
    animation: zoomIn 1.2s ease 1.6s 1 normal both;
}
@-webkit-keyframes fadeInRight {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(200px,0,0);
        transform: translate3d(200px,0,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes fadeInRight {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(200px,0,0);
        transform: translate3d(200px,0,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}
@-webkit-keyframes fadeInLeft {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-200px,0,0);
        transform: translate3d(-200px,0,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}

@keyframes fadeInLeft {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-200px,0,0);
        transform: translate3d(-200px,0,0)
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none
    }
}
/*第四屏*/
.page4Box{
    position: relative;
    width: 100%;
}
.page4Box img{
    width: 21%;
    float: left;
    margin-left: 12%;
    opacity: 0;
}
.page4T {
    font-size: 0.73rem;
    color: #ffffff;
    line-height: 1.5;
    float: left;
    margin-left: 0.8rem;
    opacity: 0;
}
.page4 .page4L1{
    animation: fadeInLeft 1s ease 1.2s 1 normal both;
}
.page4 .page4R1 {
    animation: fadeInRight 1s ease 1.5s 1 normal both;
}
.page4 .page4L2{
    animation: fadeInLeft 1s ease 1.3s 1 normal both;
}
.page4 .page4R2 {
    animation: fadeInRight 1s ease 1.7s 1 normal both;
}
.page4 .page4L3{
    animation: fadeInLeft 1s ease 1.5s 1 normal both;
}
.page4 .page4R3 {
    animation: fadeInRight 1s ease 1.9s 1 normal both;
}
/*第五屏*/
.page5Box{
    width: 50%;
    text-align: center;
    opacity: 0;
}
.page5Box img{
    width: 6rem;
    height: 6rem;
}
.page5Box div{
    color: #ffffff;
    font-size: 0.7rem;
    line-height: 1.5;
    margin-top: 0.5rem;
}
.page5 .page5Box1{
    animation: fadeInLeft 1s ease 1s 1 normal both;
}
.page5 .page5Box2 {
    animation: fadeInRight 1s ease 1s 1 normal both;
}
.page5 .page5Box3{
    animation: fadeInLeft 1s ease 1.2s 1 normal both;
}
.page5 .page5Box4 {
    animation: fadeInRight 1s ease 1.2s 1 normal both;
}
/*第六屏*/
.page6ENNA {
    margin-left: 18%;
    font-size: 0.8rem;
    color: #ffffff;
    line-height: 1.7;
    opacity: 0;
}
.page6 .page6ENNA {
    animation: fadeInRight 1s ease 0.7s 1 normal both;
}
.page6Go{
    width: 8rem;
    height: 2rem;
    display: block;
    margin: 1rem auto 0;
    background-color: rgb(196, 67, 60);
    color: #ffffff;
    text-align: center;
    line-height: 2.5em;
    font-size: 0.9rem;
}

/*各屏背景图*/
.page2 .bgImg007 ,.page3 .bgImg007,
.page4 .bgImg007,.page5 .bgImg007,.page6 .bgImg007{
    -webkit-transition: all 1s 0s;
    opacity: 1;
}